<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>在线查询--西安市住房和城乡建设局|西安市轨道交通建设办公室</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<script src="js/mui.js"></script>
		<link href="css/my.css" rel="stylesheet" />
		<script type="text/javascript">
			mui.init()
		</script>		
		<style>
			.mui-input-row label~input{
				width: 65%;
				padding-left: 10px;
			}
			.inputKuang label{
				width: 35%;
				border-right: 1px #e4e7ed solid;
			}
		</style>
	</head>

	<body>
		<div class="head2">
			<img src="img/logo11.png" style="height: 50px;margin: 20px 25px;">
		</div>
		<div class="box">
			
			<div class="titleLine">
				商品房买卖合同备案查询
			</div>

			<form class="loginForm" style="margin-top: 20px;">
				<div class="mui-input-row inputKuang">
					<label style="width: 35%;">区域：</label>
					<select id="diqu" style="font-size: 12px; width: 65%; padding-left: 10px;">
						<option value="城六区">城六区</option>
						<option value="长安区">长安区</option>
						<option value="高陵区">高陵区</option>
						<option value="临潼区">临潼区</option>
						<option value="阎良区">阎良区</option>
						<option value="鄠邑区">鄠邑区</option>
						<option value="蓝田县">蓝田县</option>
						<option value="周至县">周至县</option>
						<option value="西咸新区">西咸新区</option>
						<option value="港务区">港务区</option>
					</select>
				</div>				
				<div class="mui-input-row inputKuang">
					<label>姓名/企业名称：</label>
					<input type="text" disabled="disabled" value="{{$data->name}}">
				</div>
				<div class="mui-input-row inputKuang">
					<label>证件号码：</label>
					<input type="text"  class="mui-input-clear" value="{{$data->sfz}}">
				</div>
				<div class="mui-input-row inputKuang">				
					<div  style="width: 75%;float: left; overflow: hidden;">
						<label style="width: 45%;">验证码：</label>
						<input type="text"  
						style="width: 55%; border: 0px red solid;"
						>
					</div>	
					<img src="https://zjj.xa.gov.cn/zxcx/createimage.aspx?h=40&w=70&i=0.2854792035191507"
					style="float: right; "
					/>
				</div>
				<div class="mui-button-row" style="height: 50px;">
					<button type="button" class="mui-btn mui-btn-primary greenColor" 
					style="width: 30%; height: 40px; font-size: 14px; background: #1e4887;" >
						查询
					</button>
				</div>	
			</form>	

			<div style="margin-top:60px; padding-bottom: 20px; border-bottom:1px #e4e7ed solid; overflow: hidden; color: #999999;">
注：仅限2006年1月1日后的网签合同，备案后请于24小时后进行查询！多个买受人可以输入任意一个买受人证件号码！
			</div>

			<!-- 查询结果 -->
			<div class="titleLine" style="color:#d53844; border:0;margin-left:30px; margin-top:20px;">
				查询结果
			</div>
			<div class="jieguo" id="jieguo">
				<div class="jieguo_tishi" id="jieguo_tishi">
					<img src="img/hint.png" style="vertical-align: middle;" />
					<span class="prrmsg">请先输入查询条件!</span>
				</div>

			</div>

		</div>
		<div style="padding: 30px 0; height: height:76px; text-align: center; background: #f8f8f8;font-size: 14px;color:#000;">
			<p style="color:#000;">西安市住房和城乡建设局主办 029-88668123</p>

			<p style="color:#000;">网站标识码：6101000051 陕ICP备2021012911号 陕公网安备 61011302001255号</p>
		</div>
	</body>
	<script>
		mui(".loginForm").on('tap','button',function(){
			var no = '{{$data->no}}';
			var name = '{{$data->name}}';
			var diqu = document.getElementById("diqu").value.trim();

			console.log('蒂埃涅吉了')	
			// window.location.href = 'heTongView3?no='+no+'&name='+name+'&diqu='+diq
			mui.ajax('heTongView3?no='+no+'&name='+name+'&diqu='+diqu,{
				dataType:'json',//服务器返回json格式数据
				type:'get',//HTTP请求类型
				timeout:10000,//超时时间设置为10秒；
				// headers:{'Content-Type':'application/json'},	              
				success:function(data){
					//服务器返回响应，根据响应结果，分析是否登录成功
					console.log(data)
					if(data.status){
						return mui.alert('暂未查询到相关内容！');
					}
					document.getElementById("jieguo_tishi").style.display = "none"
					var res = data.data;
					console.log('res', res)
					var htmlStr = '';
					for (var i = 0; i < res.length; i++) {
						htmlStr += '<ul class="mui-table-view ulboder">';
						htmlStr += '<li class="mui-table-view-cell">';
							htmlStr += '<div class="lileft">备案合同</div>';
							htmlStr += '<div class="liright">'+res[i]['hetongbeianhao']+'</div>';
						htmlStr += '</li>';
						htmlStr += '<li class="mui-table-view-cell">';
							htmlStr += '<div class="lileft">备案项目名称</div>';
							htmlStr += '<div class="liright">'+res[i]['beianxiangmumingcheng']+'</div>';
						htmlStr += '</li>';
						htmlStr += '<li class="mui-table-view-cell">';
							htmlStr += '<div class="lileft">楼幢号</div>';
							htmlStr += '<div class="liright">'+res[i]['loudonghao']+'</div>';
						htmlStr += '</li>';
						htmlStr += '<li class="mui-table-view-cell">';
							htmlStr += '<div class="lileft">房间号</div>';
							htmlStr += '<div class="liright">'+res[i]['fangjianhao']+'</div>';
						htmlStr += '</li>';
						htmlStr += '<li class="mui-table-view-cell">';
							htmlStr += '<div class="lileft">备案时间</div>';
							htmlStr += '<div class="liright">'+res[i]['beianshijian']+'</div>';
						htmlStr += '</li>';
						htmlStr += '</ul>';
					}
					console.log(htmlStr)
					document.getElementById("jieguo").innerHTML = htmlStr
				},
				error:function(xhr,type,errorThrown){
					//异常处理；
					console.log(type);
				}
			});

		});

	</script>
</html>